<template lang="">
  <div class="dispose-month-statistics">
    <div class="title-wrap">
      <RouteHeadLine />
      <div class="search-wrap">
        <el-form ref="formRef" :model="params" label-width="auto">
          <el-row :gutter="50" style="margin-top: 25px">
            <el-col :span="7">
              <el-form-item label="行政区划：">
                <el-tree-select
                v-model="params.district"
                :data="adminAreaList"
                clearable
              />
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item label="企业名称：">
                <el-input
                  v-model="params.customername"
                  clearable
                  placeholder="请输入企业名称"
                ></el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col :span="6"
              ><el-form-item label="申报状态：">
                <el-select
                  v-model="params.status"
                  clearable
                  placeholder="请选择"
                >
                  <el-option
                    v-for="item in statusList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select> </el-form-item
            ></el-col> -->
            <!-- <el-col :span="6"
              ><el-form-item label="行业一级：">
                <el-select v-model="params.a" clearable placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select> </el-form-item
            ></el-col> -->
          </el-row>
          <!-- <el-row :gutter="50">
            <el-col :span="6">
              <el-form-item label="行业二级：">
                <el-select v-model="params.a" clearable placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="行业三级：">
                <el-select v-model="params.a" clearable placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="6"
              ><el-form-item label="行业四级：">
                <el-select v-model="params.a" clearable placeholder="请选择">
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  />
                </el-select> </el-form-item
            ></el-col> -->

          <!-- </el-row> -->
          <el-row :gutter="50">
            <el-col :span="7"
              ><el-form-item label="开始日期：">
                <el-date-picker
                  v-model="params.startdate"
                  type="date"
                  clearable
                  placeholder="请选择"
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
                /> </el-form-item
            ></el-col>
            <el-col :span="6.5">
              <el-form-item label="结束日期：">
                <el-date-picker
                  v-model="params.enddate"
                  type="date"
                  placeholder="请选择"
                  clearable
                  format="YYYY-MM-DD"
                  value-format="YYYY-MM-DD"
              /></el-form-item>
            </el-col>
            <el-col :span="6">
              <el-button type="primary" @click="getList"
                ><el-icon style="color: #fff; margin-right: 5px"
                  ><Search /></el-icon
                >查询</el-button
              >
            </el-col>
          </el-row>
        </el-form>
      </div>
    </div>
    <div class="data-wrap">
      <el-table
        :data="tableData"
        border
        class="table-height"
        style="width: 100%"
      >
        <el-table-column prop="customername" align="center" label="企业名称" />
        <el-table-column prop="ym" align="center" label="统计年月" />
        <el-table-column prop="wastenum" align="center" label="危废处置量" >
          <template #default="{ row }">
            <div>
              {{row.wastenum}}kg
            </div>
          </template>
           </el-table-column>
        <el-table-column prop="wastenumstock" align="center" label="危废现有库存量" >
          <template #default="{ row }">
            <div>
              {{row.wastenumstock}}kg
            </div>
          </template>
          </el-table-column>
        <!-- <el-table-column prop="address" align="center" label="超一年库存量" />
        <el-table-column prop="address" align="center" label="危废自行处置量" />
        <el-table-column prop="address" align="center" label="状态">
          <template #default v-slot="{ row }">
            <div class="submit">已提交</div>
          </template>
        </el-table-column> -->
      </el-table>
      <div style="padding-right: 60px; margin-top: 25px">
        <Pagination
          v-model:currentPage="params.page"
          :total="total"
          v-model:page-size="params.pagesize"
        />
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import http from "@http";
import ElMessage from '@msg'
import changeArea from "@/utils/changeArea";
import Pagination from "@/components/Pagination.vue";
import RouteHeadLine from "@/components/RouteHeadLine.vue";
let params = reactive({});
let handleSearch = () => {};
let total = ref(11);
let tableData = ref([]);
let statusList = ref([
  { label: "正常", value: 1 },
  { label: "停业", value: 2 },
]);
let adminAreaList = ref([]);

let getList = () => {
  http({ url: "/admPCMonthWasteDispose/datalist", data: params }).then((res) => {
    if (res.code == 0) {
      tableData.value = res.data.list;
    
      total.value = res.data.total;
      ElMessage({msg:'查询成功'})
    }
  });
};
http({ url: "/region/datalisttree" }).then((res) => {
  console.log(res, "res");
  if (res.code == 0) {
    adminAreaList.value = changeArea(res.data);
  }
});
getList();

</script>
<style lang="scss" scoped>
.dispose-month-statistics {
  width: 100%;
  height: 100%;
  padding-left: 8px;
  overflow: hidden;
  .title-wrap {
    height: 185px;
    background: #ffffff;
    padding-top: 20px;
    :deep(.el-input.el-input--suffix){
    width: 280px;
  }
  :deep(.el-input__wrapper){
    width: 280px;
  }
  :deep(.el-input.el-input--prefix.el-input--suffix ){
    width: 280px !important;
  }
    /* width: 100%; */
    .search-wrap {
      padding-left: 35px;
      padding-right: 43px;
    }
  }
  .data-wrap {
    margin-top: 10px;
    width: 100%;
    height: calc(100vh - 80px - 10px - 185px);
    background: #fff;

    padding: 10px 8px 0 8px;
    .table-height {
      height: 59vh;
      overflow-y: scroll;
    }
  }
 
}
</style>
